<template>
	<view>
		<view class="select">
			<view class="selectDate borderBottom1" @click="showDate">
				<text>选择日期</text>
				<view class="">
					<text>{{ date }}</text>
					<text class="iconfont">&#xe79a;</text>
				</view>
			</view>
			<view class="selectDate borderBottom10" @click="showDate">
				<text>选择时间</text>
				<view class="">
					<text>{{ noonShow }}</text>
					<text class="iconfont">&#xe79a;</text>
				</view>
			</view>
			<view class="selectDate borderBottom1">
				<text>选择科目</text>
				<view @click="showDate">
					<evan-radio :disabled="true" style="margin-right: 30rpx;" v-model="subject" label="科目二">科目二</evan-radio>
					<evan-radio :disabled="true" v-model="subject" label="科目三">科目三</evan-radio>
				</view>
			</view>
			<view class="selectDate borderBottom10" @click="selectTeacher">
				<text>选择教练</text>
				<view class="">
					<text>{{ teacher.name }}</text>
					<text class="iconfont">&#xe79a;</text>
				</view>
			</view>
			<view class="selectDate borderBottom1">
				<text>是否外校学员</text>
				<view class=""><evan-switch :size="20" v-model="otherChecked"></evan-switch></view>
			</view>
			<view class="otherStudent" v-if="otherChecked">
				<view class="otherStudent_teacher" style="border-bottom: 1rpx solid #d9d9d9;">
					<text>推荐教练</text>
					<input type="text" v-model="recommend" maxlength="6" placeholder="请输入教练名称" />
				</view>
				<view class="otherStudent_teacher">
					<text>所属驾校</text>
					<input type="text" v-model="school" maxlength="20" placeholder="请输入所属驾校" />
				</view>
			</view>
			<view class="practice borderBottom1" style="padding-bottom: 60rpx;padding-top: 20rpx;">
				<view class="price">
					<text>价格</text>
					<text>练习圈数</text>
				</view>

				<view class="circle">
					<text>￥{{ circleMoney }}/圈</text>
					<!-- <u-number-box :value="circleNumber" :min="1" :max="99" @change="numberChange"></u-number-box> -->
					<uni-number-box @change="numberChange" :value="circleNumber" :min="1" :max="1"></uni-number-box>
				</view>
			</view>
			<view class="name selectDate borderBottom1 ">
				<text>姓名</text>
				<input type="text" v-model="username" maxlength="6" placeholder="请输入真实姓名" />
			</view>
			<view class="name selectDate borderBottom1 ">
				<view class="phone">
					<text>手机号</text>
					<input v-model="phone" :disabled="getSMS" type="number" value="" maxlength="11" placeholder="请输入手机号码" />
				</view>

				<!-- <view @click="getCode" class="getSMS">{{ regNumber ? '获取验证码' : count + ' s' }}</view> -->
			</view>
			<!-- <view class="name selectDate borderBottom10">
				<text>验证码</text>
				<input type="number" v-model="checkSMS" maxlength="6" placeholder="请输入验证码" />
			</view> -->
			<view class="priceCount  borderBottom10">
				<view class="count">
					<text>总价</text>
					<text>￥{{ money }}</text>
				</view>
				<view v-if="couponShow" class="count" style="margin: 20rpx 0;" @click="couponHandle">
					<text>优惠券</text>
					<view class="count_right">
						<text>{{ coupon ? '-￥' + coupon : '' }}</text>
						<text class="iconfont">&#xe79a;</text>
					</view>
				</view>
				<view class="count" v-if="integralShow">
					<text>积分</text>
					<view class="integral">
						<text>{{ integral ? '-￥' + integral : '' }}</text>
						<evan-switch :size="20" v-model="checked"></evan-switch>
					</view>
				</view>
			</view>
			<view class="resultPrice">
				<view class="line1"></view>
				<view class="resultPrice_center">
					<text>最终价格：</text>
					<text>￥</text>
					<text>{{ resultMoney }}</text>
				</view>
				<view class="line1"></view>
			</view>
		</view>
		<view class="footer" @click="onNavigateTo('/pages/order/order?type=1&money=' + resultMoney)"><view class="">提交预约</view></view>
		<!-- <u-mask :show="orderFlag" :mask-click-able="false"></u-mask> -->
	</view>
</template>

<script>
import { subscribeOrder, addOrder } from '@/api/user/order/subscribeOrder.js';
import { sendSMS, checkSMS } from '@/api/sms/sms.js';
import evanRadio from '@/components/evan-radio/evan-radio.vue';
import uniNumberBox from '@/components/uni-number-box/uni-number-box.vue';
var myreg = /^(((13[0-9]{1})|(14[0-9]{1})|(15[0-9]{1})|(16[0-9]{1})|(18[0-9]{1})|(17[0-9]{1})|(19[0-9]{1}))+\d{8})$/;
export default {
	components: {
		uniNumberBox,
		evanRadio
	},
	data() {
		return {
			subject: '', //科目
			date: '',
			price: {
				type: true,
				data: []
			},
			coupon: null, //优惠券
			couponId: '', //优惠券id
			integral: 0, //积分
			timer: null, //倒计时
			count: '', //倒计时显示的数字
			phone: '', //手机号
			regNumber: true, //获取验证码的间隔
			phoneReg: false, //手机号真实性验证
			getSMS: false, //获取短信
			orderFlag: false, //订单创建的遮罩
			integralShow:false,	//是否有积分
			couponShow:false,
			noonShow: '', //时辰
			circleNumber: 1, //圈数
			circleMoney: null, //一圈的价格
			otherChecked: true, //是否是外校学员
			recommend: '', //推荐教练
			school: '', //所属驾校
			username: '', //用户姓名
			checked: false, //是否使用积分
			currentDate: '',
			teacher: {}, //教练
			resSendSMS: false, //是否已发验证码
			checkSMS: '' //检查验证码
		};
	},
	computed: {
		money: function() {
			let numReg = /^\+?[1-9][0-9]*$/;
			let res = 0;
			if (this.circleMoney) {
				this.couponShow=true;
				this.integralShow=true
				res = this.circleNumber * this.circleMoney;
				if(res==0){
					this.couponShow=false;
					this.integralShow=false
				}else{
					this.couponShow=true;
					this.integralShow=true
				}
				return res + '.00';
			} else {
				this.couponShow=false;
				this.integralShow=false
				return 0;
			}
		},
		resultMoney: function() {
			let numReg = /^\+?[1-9][0-9]*$/;
			let res = 0;
			if(this.money){
				if (this.coupon) {
					if (this.checked) {
						if(this.integral>this.money){

						}
						res = this.money - this.coupon - this.integral;
						res=res.toFixed(2)
						return res
					} else {
						res = this.money - this.coupon;
						return res=res.toFixed(2)
						
					}
				} else {
					if (this.checked) {
						res = this.money - this.integral;
						res=res.toFixed(2)
						return res
					} else {
						return this.money;
					}
				}
			}
			
		}
	},
	watch: {
		phone(val, oldVal) {
			if (val.length === 11) {
				if (!myreg.test(this.phone)) {
					this.phoneReg = false;
					return false;
				} else {
					this.phoneReg = true;
					return true;
				}
			} else {
				this.phoneReg = false;
				return false;
			}
		}
	},
	async onLoad(options) {
		if(uni.getStorageSync('userForm')){
			let obj=uni.getStorageSync('userForm')
			for(let key in obj){
				this[key]=obj[key]
			}
		}
		if (options.teacher) {
			this.teacher = JSON.parse(options.teacher);
			// console.log(this.teacher);
			let res = await subscribeOrder(this.teacher.id);
			if (res.data.integral > 0) {
				this.integral = (res.data.integral * res.data.integralmoney).toFixed(2);
				this.integralShow=true
			}
			// if(res.data.usermobile!=''){
			// }
		}
		// this.formatDate();
		if (options.lesson && options.time && options.date) {
			let lesson = JSON.parse(options.lesson);
			this.subject = lesson.title;
			this.circleMoney = lesson.price;
			if (options.time == 0) {
				this.noonShow = '上午';
			} else {
				this.noonShow = '下午';
			}
			var tmpDate = new Date();
			var year = tmpDate.getFullYear();
			this.date = year + '-' + options.date.replace(/\./g, '-');
		}
	},
	methods: {
		async getCode() {
			//获取验证码
			if (this.phoneReg == true) {
				const TIME_COUNT = 60;
				let res = await sendSMS(this.phone);
				if (res.code == 1) {
					this.resSendSMS = true;
					uni.showToast({
						title: '验证码已发送，请注意查收',
						icon: 'none',
						duration: 1500
					});
					if (!this.timer) {
						this.count = TIME_COUNT;
						this.regNumber = false;
						this.timer = setInterval(() => {
							if (this.count > 0 && this.count <= TIME_COUNT) {
								this.count--;
							} else {
								this.regNumber = true;
								clearInterval(this.timer);
								this.timer = null;
								this.getSMS = false;
							}
						}, 1000);
					}
				} else {
					uni.showToast({
						title: '发送失败，请稍候再试',
						icon: 'none',
						duration: 1500
					});
				}
			} else {
				uni.showToast({
					title: '请输入正确的手机号！',
					icon: 'none',
					duration: 1500
				});
			}
		},
		async selectTeacher() {
			//教练选择
			//选择教练
			uni.navigateTo({
				url: '/pages/selectTeacher/selectTeacher?type=1&date=' + this.date + '&dateType=' + this.noonShow
			});
			uni.$on('fire', data => {
				// data即为传过来的值
				this.date = '';
				this.noonShow = '';
				this.subject = '';
				this.teacher = data.teacher;
				//清除监听，不清除会消耗资源
				uni.$off('fire');
			});
			let res = await subscribeOrder(this.teacher.id);
			if (res.data.integral > 0) {
				this.integral = res.data.integral * res.data.integralmoney;
			}
		},
		numberChange(value) {
			//数字输入框
			this.circleNumber = value;
		},
		toggleTab(str) {
			// this.$refs[str].show();
			if (this.teacher.name) {
				uni.navigateTo({
					url: '/pages/teacherSubscribe/dateList?id=' + this.teacher.id
				});
				uni.$on('date', data => {
					// data即为传过来的值
					if (data.time == 0) {
						this.noonShow = '上午';
					} else {
						this.noonShow = '下午';
					}
					var tmpDate = new Date();
					var year = tmpDate.getFullYear();
					this.date = year + '-' + data.date.replace(/\./g, '-');
					this.subject = data.lesson.title;
					this.circleMoney = data.lesson.price;
					//清除监听，不清除会消耗资源
					uni.$off('date');
				});
			} else {
				uni.showToast({
					title: '请先选择教练',
					icon: 'none'
				});
			}
		},
		showDate() {
			// this.$refs.popup.open();
			if (this.teacher.name) {
				uni.navigateTo({
					url: '/pages/teacherSubscribe/dateList?type=1&id=' + this.teacher.id
				});
				uni.$on('date', data => {
					// data即为传过来的值
					if (data.time == 0) {
						this.noonShow = '上午';
					} else {
						this.noonShow = '下午';
					}
					var tmpDate = new Date();
					var year = tmpDate.getFullYear();
					this.date = year + '-' + data.date.replace(/\./g, '-');
					this.subject = data.lesson.title;
					this.circleMoney = data.lesson.price;
					//清除监听，不清除会消耗资源
					uni.$off('date');
				});
			} else {
				uni.showToast({
					title: '请先选择教练',
					icon: 'none'
				});
			}
		},
		lessonHandle() {
			if (this.teacher.name) {
				uni.navigateTo({
					url: '/pages/teacherSubscribe/dateList?type=1&id=' + this.teacher.id
				});
				uni.$on('date', data => {
					// console.log(data);
					// data即为传过来的值
					if (data.time == 0) {
						this.noonShow = '上午';
					} else {
						this.noonShow = '下午';
					}
					var tmpDate = new Date();
					var year = tmpDate.getFullYear();
					this.date = year + '-' + data.date.replace(/\./g, '-');
					this.subject = data.lesson.title;
					this.circleMoney = data.lesson.price;
					//清除监听，不清除会消耗资源
					uni.$off('date');
				});
			} else {
				uni.showToast({
					title: '请先选择教练',
					icon: 'none'
				});
			}
		},
		formatDate() {
			var date = new Date();
			var seperator1 = '-';
			var year = date.getFullYear();
			var month = date.getMonth() + 1;
			var strDate = date.getDate() + 1;
			if (month >= 1 && month <= 9) {
				month = '0' + month;
			}
			if (strDate >= 0 && strDate <= 9) {
				strDate = '0' + strDate;
			}
			var currentdate = year + seperator1 + month + seperator1 + strDate;
			this.date = currentdate;
		},
		couponHandle() {
			if (this.subject) {
				if (this.subject == '科目二') {
					uni.navigateTo({
						url: '/pages/tabbar/personCenter/myWallet/discount?id=1&money=' + this.money
					});
				} else {
					uni.navigateTo({
						url: '/pages/tabbar/personCenter/myWallet/discount?id=2&money=' + this.money
					});
				}
				uni.$on('coupon', data => {
					// console.log(data);
					// data即为传过来的值
					this.coupon = data.price;
					this.couponId = data.couponId;
					//清除监听，不清除会消耗资源
					uni.$off('coupon');
				});
			} else {
				uni.showToast({
					title: '请先选择科目再选择优惠券',
					icon: 'none'
				});
			}
		},
		async onNavigateTo(url) {
			if (this.date && this.noonShow && this.subject && this.teacher.id && this.circleMoney && this.username) {
				// let res = await checkSMS(this.phone, this.checkSMS);
					uni.showLoading({
						title: '订单生成中，请稍候'
					});
					this.orderFlag = true;
					let msg={
						recommend:this.recommend,
						school:this.school,
						username:this.username,
						phone:this.phone
					}
					uni.setStorageSync('userForm',msg)
					let noon;
					let subject;
					let integral;
					subject=this.subject == '科目二'?1:2
					noon=this.noonShow == '上午'?'am':'pm'
					if(!this.checked){
						integral=0
					}else{
						integral=this.integral
					}
					let info = {
						yuyuedate: this.date,
						yuyuetime: noon,
						subjectsid: subject,
						coachid: this.teacher.id,
						isothorschool: Number(this.otherChecked),
						tjcoachid: this.recommend,
						drivingschool: this.school,
						yuyuenumber: this.circleNumber,
						price: this.circleMoney,
						realname: this.username,
						phone: this.phone,
						integral: integral*100,
						usercouponid: this.couponId
					};
					let result = await addOrder(info);
					uni.hideLoading();
					if (result.code == 1) {
						uni.navigateTo({
							url: url + '&orderNumber=' + result.data.ordernumber
						});
					} else {
						uni.showToast({
							title:result.msg,
							icon:'none'
						});
					}
			} else {
				uni.showToast({
					title: '请确认表单填写完整！',
					icon: 'none'
				});
			}
		}
	}
};
</script>

<style lang="scss">
@import './css/teacherSubscribe.scss';
</style>
